<!DOCTYPE html>
<html xmlns:shiro="http://www.w3.org/1999/xhtml">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
<div class="wrapper wrapper-content ">
    <div class="col-sm-12">
        <div class="ibox">
            <div class="ibox-body">
                <div class="fixed-table-toolbar">
                    <div class="columns pull-left">
                        <div class="col-md-2">
                            <button shiro:hasPermission="system:product:add" type="button" class="btn  btn-primary"
                                    onclick="add()">
                                <i class="fa fa-plus" aria-hidden="true"></i>添加
                            </button>
                        </div>

                        <div class="col-md-2" style="margin-left: 5px">
                            <button shiro:hasPermission="system:product:batchRemove" type="button"
                                    class="btn  btn-danger"
                                    onclick="batchRemove()">
                                <i class="fa fa-trash" aria-hidden="true"></i>删除
                            </button>
                        </div>

                        <div class="col-md-2" style="margin-left: 5px">
                            <button class="btn btn-info dropdown-toggle" type="button" id="categaryID"
                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                -1.没有分类
                                <span class="caret"></span>

                            </button>
                            <ul class="dropdown-menu bg-info" style="background-color: #e5ffff;">
                                <li th:each="category : ${categorys}"><a href="#"
                                    th:onclick="'javascript:catclick(\''+${category.categoryId}+'\', \''+${category.categoryName}+'\');'"
                                >[[${category.categoryId}]] . [[${category.categoryName}]]</a>
                                </li>

                            </ul>
                            <input type="hidden" id="categoryIdforchoose" value="-1">
                        </div>

                        <div class="col-md-2" style="margin-left: 5px">
                            <button class="btn btn-info dropdown-toggle" type="button" id="level2"
                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"
                            >
                                2.没有二级
                                <span class="caret"></span>

                            </button>
                            <ul id="mylevel2" class="dropdown-menu bg-info" style="background-color: #e5ffff;">
                                <!--<li th:each="level2Cate : ${level2Cates}"><a href="#"
                                         th:onclick="'javascript:mylevel2click(\''+${level2Cate}+'\');'"
                                >[[${level2Cate}]]</a>
                                </li>-->
                            </ul>
                            <input type="hidden" id="mylevel2str" value="2.没有二级">
                        </div>

                        <div class="col-md-2" style="margin-left: 5px">
                            <button class="btn btn-info dropdown-toggle" type="button" id="brand"
                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                3.没有品牌
                                <span class="caret"></span>

                            </button>
                            <ul  id="brandul" class="dropdown-menu bg-info" style="background-color: #e5ffff;">
                                <!--<li th:each="brand : ${brands}"><a href="#"
                                    th:onclick="'javascript:brandclick(\''+${brand}+'\');'"
                                >[[${brand}]]</a>
                                </li>-->
                            </ul>
                            <input type="hidden" id="brandinput" value="3.没有品牌">
                        </div>

                        <div class="col-md-1" style="margin-left: 5px">
                            <button class="btn btn-info dropdown-toggle" type="button" id="productNum"
                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"
                            >
                                4.没有编号
                                <span class="caret"></span>

                            </button>
                            <ul id="productNumul" class="dropdown-menu bg-info" style="background-color: #e5ffff;">
                                <!--<li th:each="productNum : ${productNums}"><a href="#"
                                  th:onclick="'javascript:productNumclick(\''+${productNum}+'\');'"
                                >[[${productNum}]]</a>
                                </li>-->
                            </ul>
                            <input type="hidden" id="productNuminput" value="4.没有编号">
                        </div>



                    </div>

                    <div class="columns pull-right">
                        <button class="btn btn-success" onclick="reLoad()">查询</button>
                    </div>
                    <div class="columns pull-right col-md-2 nopadding">
                        <input id="searchName" type="text" class="form-control"
                               placeholder="支持模糊查询哦">
                    </div>

                </div>
                <table id="exampleTable" data-mobile-responsive="true">
                </table>
            </div>
        </div>
    </div>
</div>
<!--shiro控制bootstraptable行内按钮看见性 来自bootdo的创新方案 -->
<div>
    <script type="text/javascript">
        var s_edit_h = 'hidden';
        var s_remove_h = 'hidden';
        var s_resetPwd_h = 'hidden';
    </script>
</div>
<div shiro:hasPermission="system:product:edit">
    <script type="text/javascript">
        s_edit_h = '';
    </script>
</div>
<div shiro:hasPermission="system:product:remove">
    <script type="text/javascript">
        s_remove_h = '';
    </script>
</div>
<div shiro:hasPermission="system:product:resetPwd">
    <script type="text/javascript">
        s_resetPwd_h = '';
    </script>
</div>
</div>
<div th:include="include :: footer"></div>
<script type="text/javascript">


  /*  function mylevel2click(mylevel2) {
        $("#mylevel2str").val(mylevel2);
        $("#level2").text(mylevel2);
        var el = $('<span class="caret"></span>');

        //aggresult();
        $("#level2").append(el);
        reLoad();
    }*/

    function aggresult() {
        $.ajax({
            url: "/system/product/getaggresult",
            type: "post",
            dataType:"json",
            data:{
                "categoryId":$("#categoryIdforchoose").val(),
                "level2Cate":$("#mylevel2str").val(),
                "brand":$("#brandinput").val(),
                "productNum":$("#productNuminput").val()
            },

            success: function (r) {
                if (r.code == 0) {
                    console.log("agg结果  品牌="+r.brands);
                    console.log("agg结果  二级="+r.level2Cates);
                    console.log("agg结果  编号="+r.productNums);
                    buildall(r.brands,r.level2Cates,r.productNums);
                } else {
                    layer.msg(r.msg);
                }
            }
        });
    }

    function buildall(brands,level2cates,productNums) {
        buildbrands(brands);
        buildlevel2cates(level2cates);
        buildproductNums(productNums);

        reLoad();
    }

    var isAgg = false;//是否开启聚合，开启之后地啊你下拉。会只显示可选的下拉，但是速度会慢大概4秒左右，体验不好

    function buildlevel2cates(level2cates) {
        $("#mylevel2").empty();
        console.log("二级构建="+level2cates)
         for(var a= 0;a<level2cates.length;a++){
             var levelLi = "<li><a class='mylevel2a'>"+level2cates[a]+"</a></li>";
             $("body").on("click", ".mylevel2a", function() {

                 $("#level2").text($(this).text());
                 $("#mylevel2str").val($(this).text());
               //
                 if(isAgg){
                     aggresult();
                 }else{
                     reLoad();
                 }
             });
             $("#mylevel2").append(levelLi);
         }
    }
    function buildbrands(brands) {
        console.log("品牌构建="+brands)
        $("#brandul").empty();
        for(var a= 0;a<brands.length;a++){
            var levelLi = "<li><a class='mybranda'>"+brands[a]+"</a></li>";
            $("body").on("click", ".mybranda", function() {

                $("#brand").text($(this).text());
                $("#brandinput").val($(this).text());
                if(isAgg){
                    aggresult();
                }else{
                    reLoad();
                }
            });
            $("#brandul").append(levelLi);
        }
    }

    function buildproductNums(productNums) {
        console.log("编号构建="+productNums)
        $("#productNumul").empty();
        for(var a= 0;a<productNums.length;a++){
            var levelLi = "<li><a class='myproductNuma'>"+productNums[a]+"</a></li>";
            $("body").on("click", ".myproductNuma", function() {

                $("#productNum").text($(this).text());
                $("#productNuminput").val($(this).text());
                if(isAgg){
                    aggresult();
                }else{
                    reLoad();
                }
            });
            $("#productNumul").append(levelLi);
        }
    }


  /*  function brandclick(brand) {
        $("#brandinput").val(brand);
        $("#brand").text(brand);
        var el = $('<span class="caret"></span>');

        $("#brand").append(el);
        reLoad();
    }*/
   /* function productNumclick(productNum) {
        $("#productNuminput").val(productNum);
        $("#productNumclick").text(productNum);
        var el = $('<span class="caret"></span>');

        $("#productNumclick").append(el);
        reLoad();
    }*/

    function catclick(catId, catName) {

        $("#categaryID").text(catId+'.'+catName);
        var el = $('<span class="caret"></span>');

        $("#categaryID").append(el);
        $("#categoryIdforchoose").val(catId);

        reLoad();

        aggresult();

    }


    function downexcel() {
        window.location = "/产品Excel模板.xls";
    }
</script>
<script type="text/javascript" src="/js/appjs/system/product/product.js"></script>
</body>
</html>